Web development and Tech news Blog site. WEBISFREE.com
[JavaScript] How to set the maximum length of an array
Last Modified : 16 May, 2023 / Created : 17 May, 2023
If an array in JavaScript has multiple values, you may want to fix the maximum number of values, such as 5 or 10. In this case, you can think about how to do it. For example, consider the following.
Before : [1, 2, 3, 4, 5]
// When you want to keep only three values
After : [1, 2, 3]
# Ways to Set Maximum Length of JavaScript Arrays
First, let's create an array of the desired length when creating an array. The myArray below has been created to have a length of 5.
const maxSize = 5;
const myArray = new Array(maxSize );
console.log(myArray.length);
// Outputs
5
const myArray = new Array(maxSize );
console.log(myArray.length);
// Outputs
5
We have simply created an array with 5 values. Now we want to change the above array to an array with a maximum length of 3. One way to do this is by using the take() method of the lodash library.
! lodash take() method
The take() method used with arrays is a method that sets the maximum length of an array and returns an array that is equal to or smaller than that size. For a simple example, we can use take() to obtain a new array of size 3 from an array containing values from 1 to 10, as shown below.
import _ from 'lodash';
const myArray = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
const myArrayFive = _.take(myArray, 5);
console.log(limitedArray.length);
// Outputs
[1, 2, 3, 4, 5]
const myArray = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
const myArrayFive = _.take(myArray, 5);
console.log(limitedArray.length);
// Outputs
[1, 2, 3, 4, 5]
A new array, myArrayFive, has been created simply using take() with an array of size 5.
What happens if the length used in take() is smaller than the size of the array? In this case, the same array will be returned because the original array is already smaller in size and will not increase in size.
const myArray = [1, 2, 3];
const myArrayFive = _.take(myArray, 5);
console.log(limitedArray.length);
// Outputs
[1, 2, 3]
const myArrayFive = _.take(myArray, 5);
console.log(limitedArray.length);
// Outputs
[1, 2, 3]
In the previous example, we looked at how to use take(). If you're using JavaScript, you can write it as follows.
! Setting the maximum length of an array using pure JavaScript
One way to set the maximum length of an array is to use the length property. In this case, we can use the following code for the previous example.
let myArray = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
myArray.length = 5
console.log(myArray.length);
// Outputs
[1, 2, 3, 4, 5]
myArray.length = 5
console.log(myArray.length);
// Outputs
[1, 2, 3, 4, 5]
There is a difference when using 'length' that it changes the length of the existing array instead of creating a new one.
What would happen if the length of the existing array is shorter? This is the case where length 10 is used on the changed [1, 2, 3, 4, 5] in the example above.
let myArray = [1, 2, 3, 4, 5];
myArray.length = 10
console.log(myArray.length);
// Outputs
[1, 2, 3, 4, 5, undefined, undefined, undefined, undefined, undefined]
myArray.length = 10
console.log(myArray.length);
// Outputs
[1, 2, 3, 4, 5, undefined, undefined, undefined, undefined, undefined]
This time, the result is different from using take(). Empty values are created in the array, and you can see that the array has been resized to a length of 10.
If you want to remove Falsy values, you can add the following code as shown above.
let myArray = [1, 2, 3, 4, 5, undefined, undefined, undefined, undefined, undefined];
myArray.filter(i => i);
// Outputs
[1, 2, 3, 4, 5]
myArray.filter(i => i);
// Outputs
[1, 2, 3, 4, 5]
So far, we have briefly looked at two ways to set the maximum length of a JavaScript array: using the lodash library and using pure JavaScript.
Perhaps you're looking for the following text as well?
